{extend name="base"/}
{block name="main"}
<link rel="stylesheet" type="text/css" href="/public/css/defau.css">
<input  type="hidden" id="goods_select_id" value="">
<script src="/public/menu/js/jquery.artdialog.js"></script>
<script src="/public/menu/js/iframetools.js"></script>
<script src="/public/menu/js/index_component.js"></script>
<article class="cl pd-20">
    <div id="tab_demo" class="HuiTab" style="margin-top: 0px; position: relative;">
        <div class="tabBar clearfix">
            <span onclick="window.location.href='{:url('bargain/index')}'">活动列表</span>
            <span class="current" onclick="window.location.href='{:url('bargain/add_bargain')}'">添加活动</span>
            <a href="javascript:;" onclick="layer_show('选择商品','__CONF_SITE__admin/Bargain/returnGoodsList','800','600')" class="n_tab_add"><i class="Hui-iconfont">&#xe600;</i>从已有商品添加</a>
        </div>
    </div>
    <form action="" method="post" class="form form-horizontal" id="my_bargain">
        <input type="hidden" value="" id="goods_id">
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>活动名称：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" autocomplete="off" v-model="goods_name" value="" placeholder="活动名称" class="input-text" id="bargain_name">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>活动主图：</label>
            <div class="formControls col-xs-8 col-sm-9">
<div style="position: absolute;top:5px;left:200px;color: #ccc;">建议图标尺寸：600*300px</div>
                <img width="120"  v-if="img_path!=''"  :src="img_path" class="thumbnail" id='master_goods_pic'>
                <input onclick="select_img('1','zhu');" class="btn btn-default" type="button" value="选择图片">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>轮播图：</label>
            <div class="formControls col-xs-8 col-sm-9">
<div style="position: absolute;top:5px;left:200px;color: #ccc;">建议图标尺寸：600*300px</div>
                <img v-for="item in array_img" width="120"  :src="item.url" class="thumbnail">
                <input onclick="select_img('5','lun');" class="btn btn-default" type="button" value="选择图片">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>活动分类：</label>
            <div class="formControls col-xs-8 col-sm-3">
                <span class="select-box">
                  <select class="select" size="1" id="class_id">
                    <option value="-1">请选择</option>
                      {volist name="class_list" id="c"}
                             <option value="{$c.id}">{$c.class_name}</option>
                      {/volist}
                  </select>
                </span>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>原价：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="original_price" type="number" autocomplete="off" v-model="price" value="" placeholder="原价" class="input-text">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>底价：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="lowest_price" type="number" autocomplete="off" value="" class="input-text" placeholder="底价">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>完成人数：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="completed_number" type="number" autocomplete="off" value="" class="input-text" placeholder="完成人数">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>活动数量：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="bargain_inventory" type="number" autocomplete="off" value="" class="input-text" placeholder="活动数量" >
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>开始时间：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="star_time" class="input-text Wdate" type="text" onclick="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss',minDate:'%y-%M-{%d}'})" style="width:160px;"/>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>结束时间：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="end_time" type="text" onclick="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss',minDate:'%y-%M-{%d+1}'})" value=""  class="input-text Wdate" style="width:160px;">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>消费截至时间：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input id="consumption_time" type="text"  onclick="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss',minDate:'%y-%M-{%d+1}'})" value="" class="input-text Wdate" style="width:160px;">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>活动规则：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <div id="editor" type="text/plain" style="width: 50%; height: 500px;"></div>
                </div>
                </div>
                <div class="row cl">
                    <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                    <input class="btn btn-primary radius" onclick="addSuppAjax()" type="button" value="提交">
                    </div>
                    </div>
                    </form>
                    </article>
                    {/block}
                {block name="script"}
                <script type="text/javascript" src="/public/js/vue.js"></script>
                <link href="/public/static/umedito/themes/default/_css/umeditor.css" type="text/css" rel="stylesheet">
                <script type="text/javascript" src="/public/static/umedito/third-party/jquery.min.js"></script>
                <script type="text/javascript" src="/public/static/umedito/third-party/template.min.js"></script>
                <script type="text/javascript" charset="utf-8" src="/public/static/umedito/umeditor.config.js"></script>
                <script type="text/javascript" charset="utf-8" src="/public/static/umedito/_examples/editor_api.js"></script>
                <script type="text/javascript" src="/public/static/umedito/lang/zh-cn/zh-cn.js"></script>
                <script src="/public/menu/js/jquery.artdialog.js"></script>
                <script src="/public/menu/js/iframetools.js"></script>
                <script type="text/javascript">
                    var bannerVM = new Vue({
                        el: '#my_bargain',
                        data: {
                            goods_id:'',//商品ID
                            goods_name:'',//商品名称
                            img_path:'',//图片链接
                            img_id:'',//图片ID
                            price:'',//价格
                            array_img:[],
                        }
                    });
                    $(function () {
                        var ue =UM.getEditor('editor',{
                            imageUrl:"__CONF_SITE__app/Umupload/uploadFile", //处理图片上传的接口
                            imageFieldName:"upfile", //上传图片的表单的name
                            imagePath: ""
                        });
                    });
                    //模块输入信息验证
                    function verify(bargain_picture,bargain_name,bargain_inventory,lowest_price,star_time,end_time,consumption_time,activity_rules,completed_number,array_img,class_id) {
                        if (bargain_name==''){
                            layer.msg('活动名称不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (bargain_picture==''){
                            layer.msg('主图不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (lowest_price==''){
                            layer.msg('底价不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (completed_number==''){
                            layer.msg('完成人数不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (bargain_inventory==''){
                            layer.msg('活动数量不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (star_time==''){
                            layer.msg('开始时间不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (end_time==''){
                            layer.msg('结束时间不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (consumption_time==''){
                            layer.msg('消费截至时间不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (activity_rules==''){
                            layer.msg('活动规则不能为空',{icon:5,time:1000});
                            return false;
                        }
                        if (array_img==''){
                            layer.msg('请选择轮播图',{icon:5,time:1000});
                            return false;
                        }
                        if (class_id == 0) {
                            layer.msg('请选择活动分类',{icon:5,time:1000});
                            return false;
                        }
                        return true;
                    }
                    var flag = false;//防止重复提交
                    //添加用户
                    function addSuppAjax() {
                        var bargain_name = $("#bargain_name").val();
                        var bargain_picture =bannerVM.img_id;
                        var bargain_inventory  = $("#bargain_inventory").val();
                        var original_price = $("#original_price").val();
                        var lowest_price = $("#lowest_price").val();
                        var star_time=$("#star_time").val();
                        var end_time=$("#end_time").val();
                        var consumption_time=$("#consumption_time").val();
                        var activity_rules= UM.getEditor('editor').getContent();
                        var completed_number=$("#completed_number").val();
                        var array_img= JSON.stringify(bannerVM.array_img);
                        var class_id=$("#class_id").val();
                        if(parseFloat(original_price)<=parseFloat(lowest_price)){
                            layer.msg('原价不能大于低价',{icon:5,time:1000});
                            return false;
                        }
                        if(verify(bargain_picture,bargain_name,bargain_inventory,lowest_price,star_time,end_time,consumption_time,activity_rules,completed_number,array_img,class_id) && !flag){
                            flag = true;
                            $.ajax({
                                type : "post",
                                url : "{:url('bargain/add_bargain')}",
                                data : {
                                    'bargain_name' : bargain_name,
                                    'bargain_picture' : bargain_picture,
                                    'bargain_inventory' : bargain_inventory,
                                    'original_price' : original_price,
                                    'lowest_price':lowest_price,
                                    'star_time':star_time,
                                    'end_time':end_time,
                                    'consumption_time':consumption_time,
                                    'activity_rules':activity_rules,
                                    'completed_number':completed_number,
                                    'array_img':array_img,
                                    'class_id': class_id,
                                },
                                success : function(data) {
                                    console.log(data);
                                    if(data['code']>0){
                                        layer.msg('添加成功!',{icon:1,time:1000},function () {
                                            window.parent.location.href="{:url('bargain/index')}";
                                        });
                                    }
                                    else{
                                        flag = false;
                                        layer.msg(data['message'],{icon:5,time:1000});
                                    }
                                }
                            });
                        }
                    }
                    function select_img(number,type) {
                        art.dialog.open(('__CONF_SITE__admin/images/dialogalbumlist&number=' + number + '&type=' + type), {
                            lock : true,
                            title : "我的图片",
                            width : 900,
                            height : 620,
                            drag : false,
                            background : "#000000",
                            scrollbar:false,
                        }, true);
                    }
                    //选择多张图片
                    function lun_images(id_array,path_array) {
                        var arr=[];
                        id_array=id_array.split(",");
                        path_array=path_array.split(",");
                        for (var i=0;i<id_array.length;i++){
                            var item={};
                            item['id']=id_array[i];
                            item['url']=path_array[i];
                            arr.push(item);
                        }
                        bannerVM.array_img=arr;
                    }
                    //选择单张图片
                    function zhu_images(id,path) {
                        bannerVM.img_path=path;
                        bannerVM.img_id = id;
                    }
                function select_normal_goods(goods_id) {
                    $.post("{:url('bargain/returnGoodsList')}",{goods_id:goods_id},
                        function (data) {
                            if(data.message == '操作成功')
                            {
                                $('#lowest_price').val(data.code.cost_price);
                                $('#editor').html(data.code.description);
                                $('#bargain_inventory').val(data.code.stock);
                                bannerVM.img_path = data.code.img_cover;
                                bannerVM.price = data.code.price;
                                bannerVM.img_id = data.code.images;
                                bannerVM.goods_name = data.code.goods_name;
                                var img_arr = data.code.img_arr;
                                var arr=[];
                                for (var i=0;i<img_arr.length;i++){
                                    var item={};
                                    item['id']=img_arr[i]['img_id'];
                                    item['url']=img_arr[i]['img_cover'];
                                    arr.push(item);
                                }
                                bannerVM.array_img=arr;
                            }
                        },"json");
                }
                </script>
                {/block}